/*
 * Created by Administrator on 2017/3/17.
 */
var Layer = require('../../../src/libs/layer');
var Input = require('../../../src/libs/Input');
var investDM = new UDM({
    value:''
})

var interestDM = new UDM({
    value:''
})

var durationDM = new UDM({
    value:''
})
 var PageDM = {
    invest:investDM,
     interest:interestDM,
     duration:durationDM
 }
/**
 *
 * @author chenzefang
 *
 * 面包屑组件
 * @class Calculator
 * @extends Basic
 * @param [separator ">" 默认分隔符
 *
 * 示例：
 *
 *     @example
 *     <Calculator />
 *
 */
var Calculator = React.createClass({
    getDefaultProps:function(){
        return{
            days:this.props.days
        }
    },
    getInitialState:function () {
        return{
            invest:PageDM.invest.value,
            interest:PageDM.interest.value,
            duration:PageDM.duration.value
        }
    },
    /*计算器验证输入,检查是不是数字及两数位数*/
    chcknullnum: function(a) {
        if (!isNaN(a) && a != "") {
            return a;
        } else {
            return false;
        }
    },
    chckisnum:function(a) {
        if (a.indexOf(".") > -1) {
            //如果有小数点
            var b = a.split('.')[1].length;
            if (b > 2) {
                a = false;
            }
        }
        return a;
    },
    showCalculator: function(){
        var div = document.createElement("div");
        div.id = "grey-background";
        document.body.appendChild(div);
        this.refs['calculator-layer'].style.display = "block";
    },
    hideCalculator: function(){
        this.refs['calculator-layer'].style.display = "none";
        document.body.removeChild(document.getElementById("grey-background"));
    },
    investSumHandler: function(e){
        var v = e.target || e.srcElement;
        // var val = PageDM.invest.getValue();
        PageDM.invest.setValue(v.value.replace(/[^\d.]/g,''));
    },
    interestHandler: function(e){
        var v = e.target || e.srcElement;
        // var val = PageDM.interest.getValue();
        PageDM.interest.setValue(v.value.replace(/[^\d.]/g,''));
    },
    durationHandler: function(e){
        var v = e.target || e.srcElement;
        // var val = PageDM.duration.getValue();
        PageDM.duration.setValue(v.value.replace(/\D/g,''));
    },
    calculateHandler: function(){
        var _this = this;
        var a = PageDM.invest.getValue(); //投资金额
        if (!_this.chcknullnum(a)) {
            alert("投资金额不能为空且只能是数字");
            _this.refs['invest-sum'].focus();
            return;
        }
        if (!_this.chckisnum(a)) {
            alert("投资金额最多只能是两位数字！");
            _this.refs['invest-sum'].focus();
            return;
        }
        var b = PageDM.interest.getValue(); //预期年化利率
        if (!_this.chcknullnum(b)) {
            alert("预期年化利率不能为空且只能是数字！");
            _this.refs['interest'].focus();
            return;
        }
        if (!_this.chckisnum(b)) {
            alert("预期年化利率最多只能是两位数字！");
            _this.refs['interest'].focus();
            return;
        }
        var c = PageDM.duration.getValue(); //预期年化利率
        if (!_this.chcknullnum(c)) {
            alert("投资期限不能为空且只能是数字！");
            _this.refs['duration'].focus();
            return;
        }
        var rm = UMath.Earnings(a * 10000,b,c,_this.props.days);
        _this.refs['return-money'].innerHTML = UFormatter.formatMoney(rm,2);
        _this.refs['computer-allmoney'].innerHTML = UFormatter.formatMoney((rm + a * 10000),2);
    },
    resetHandler: function(){
        var _this = this;
        PageDM.invest.setValue('');
        PageDM.interest.setValue('');
        PageDM.duration.setValue('');
       _this.refs['invest-sum'].checkPlaceHolder();
       _this.refs['interest'].checkPlaceHolder();
       _this.refs['duration'].checkPlaceHolder();
        _this.refs['return-money'].innerHTML = "";
        _this.refs['computer-allmoney'].innerHTML = "";
    },
    layerOpen:function(){
        this.refs.calculatorLayer.layerOpen();
    },
    layerClose:function(){
        this.resetHandler();
        this.refs.calculatorLayer.layerClose();
    },
    render: function(){
        var _this = this;
        var _title = <div className="ucs-alert-title"><b></b><span>收益计算器</span><b></b></div>;
        return (
            <div className="ucs-calculator">
                <Layer ref="calculatorLayer" closeBack={_this.layerClose.bind(_this)} title={_title}>
                    <div className="alert-content">
                        <div className="alert-load">
                            <div className="layer-computer">
                                <div className="form-group">
                                    <label>投资金额：</label>
                                    <div className="input"><Input dmbind={PageDM.invest.dmbind} type="text" ref="invest-sum" className="input-control computer-money" maxlength="9" onKeyUp={_this.investSumHandler.bind(this)} placeholder="请输入投资金额" /></div>
                                    <span className="unit">万元</span>
                                </div>
                                <div className="form-group">
                                    <label>预期年化利率：</label>
                                    <div className="input"><Input dmbind={PageDM.interest.dmbind} type="text" ref="interest" className="input-control computer-bf" maxlength="4" onKeyUp={_this.interestHandler} placeholder="请输入预期年化利率" /></div>
                                    <span className="unit">%</span>
                                </div>
                                <div className="form-group">
                                    <label>投资期限：</label>
                                    <div className="input"><Input dmbind={PageDM.duration.dmbind} type="text" ref="duration" className="input-control computer-data" maxlength="4" onKeyUp={_this.durationHandler} onafterpaste="this.value=this.value.replace(/\D/g,'')" placeholder="请输入投资期限" /></div>
                                    <span className="unit">天</span>
                                </div>
                                <div className="content">
                                    <p><span className="title">预期收益：</span><span className="return-money fcred" ref="return-money"></span> 元</p>
                                    <p><span className="title">预期本息合计：</span><span className="computer-allmoney fcred" ref="computer-allmoney"></span> 元</p>
                                </div>
                                <div className="alert-button">
                                    <input type="button" className="btn btn-confirm computer-button" value="计算" onClick={_this.calculateHandler.bind(_this)}/>
                                    <input type="reset" value="重置" className="btn btn-cancel computer-reset" onClick={_this.resetHandler.bind(_this)}/>
                                </div>
                            </div>
                        </div>
                    </div>
                </Layer>
            </div>

        )
    }
});
module.exports = Calculator;